<!--
 * @Author: xiaxia
 * @Description: 
 * @Date: 2023-09-13 14:58:00
 * @LastEditTime: 2024-06-03 11:22:32
 * @FilePath: \vue-admin-template\src\components\issueInvioce\module\Seller.vue
-->
<template>
  <div>
    <Information :title="'销售方信息'" :showInfo.sync="showInfo">
      <el-form 
        ref="sellForm"
        size="mini"
        :model="sellForm" 
        label-width="100px"
        label-position="left"
      >
        <el-form-item label="销方名称" prop="orgName">
          <div style="display: flex;">
            <el-input disabled v-model="sellForm.orgName" placeholder="请输入"></el-input>
            <el-input disabled v-model="sellForm.orgMachine" placeholder="请输入" style="width:80px"></el-input>
            <el-button class="butC" icon="el-icon-tickets" type="primary" @click="showD"  size="mini"></el-button>
          </div>
        </el-form-item>
        <el-form-item label="销方税号" prop="orgTaxcode">
          <el-input disabled v-model="sellForm.orgTaxcode" placeholder="请输入"></el-input>
        </el-form-item>
        <div v-show="showInfo">
          <el-form-item label="销售方地址" prop="orgAddress">
            <el-input v-model="sellForm.orgAddress" placeholder="请输入"></el-input>
          </el-form-item>
          <el-form-item label="电话" prop="orgTelephone">
            <el-input v-model="sellForm.orgTelephone" placeholder="请输入"></el-input>
          </el-form-item>
          <el-col :span="20" style="padding-left: 0;">
            <el-form-item label="销方开户银行" prop="orgBankname" label-width="100px">
              <el-input v-model="sellForm.orgBankname" placeholder="请输入"></el-input>
            </el-form-item>
            <el-form-item label="银行账户" prop="orgBankaccount">
              <el-input v-model="sellForm.orgBankaccount" placeholder="请输入"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="4">
            <div style="height: 80px; display: flex; justify-content: center;align-items: center;">
              <el-checkbox v-model="xfBank" @change="xfBankC">是否展示</el-checkbox>
            </div>
          </el-col>
          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="收款人" prop="payeeName">
                <el-input v-model="sellForm.payeeName" placeholder="请输入"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="复核人" prop="checkName" label-width="80px">
                <el-input v-model="sellForm.checkName" placeholder="请输入"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
        </div>
      </el-form>
    </Information>

    <!-- 弹窗 -->
    <el-drawer
      title="销售方信息"
      size="700px"
      :visible.sync="drawerShow"
    >
      <el-table :data="sellData" class="drawerC">
        <el-table-column type="index" label="序号" width="50" show-overflow-tooltip></el-table-column>
        <el-table-column prop="orgName" label="名称" width="150" show-overflow-tooltip></el-table-column>
        <el-table-column prop="orgTaxcode" label="纳税人识别号" width="180" show-overflow-tooltip></el-table-column>
        <el-table-column prop="orgMachine" label="盘号" width="60"></el-table-column>
        <el-table-column prop="orgAddress" label="地址" width="150" show-overflow-tooltip></el-table-column>
        <el-table-column prop="orgTelephone" label="电话" width="150" show-overflow-tooltip></el-table-column>
        <el-table-column prop="orgBankname" label="开户行" width="150" show-overflow-tooltip></el-table-column>
        <el-table-column prop="orgBankaccount" label="银行账户" width="150" show-overflow-tooltip></el-table-column>
        <el-table-column fixed="right" label="操作" width="80">
        <template #default="{row}">
          <el-button
            @click="chooSell(row)"
            type="text"
            size="small">
            选择
          </el-button>
        </template>
      </el-table-column>
      </el-table>
      <el-pagination
        @size-change="hSizeChange"
        @current-change="hCurrentChange"
        :current-page="searchForm.pageNum"
        :page-sizes="[10, 15, 20]"
        :page-size="searchForm.pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="searchForm.rowCount">
      </el-pagination>
    </el-drawer>
  </div>

</template>

<script>
import Information from "@/components/issueInvioce/module/Information.vue";
export default {
  components:{
    Information
  },
  data() {
    return{
      sellForm:{
        orgName: '',
        orgTaxcode: '',
        orgAddress: '',
        orgTelephone: '',
        orgBankname: '',
        orgBankaccount: '',
        orgId: '',
        orgMachine: '00',
        xfBank: '0',
        payeeName: '', // 收款人
        checkName: '', // 复核人
      },
      xfBank:false, 
      drawerShow: false, // 销方
      showInfo: false, // 显示更多
      searchForm: {
        pageSize: 10,
        pageNum: 1,
        rowCount: 0,
      },
      sellData: []
    }
  },
  methods: {
    // 是否展示
    xfBankC(val) {
      if(val) {
        this.sellForm.xfBank = '1'
      } else {
        this.sellForm.xfBank = '0'
      }
    },
    // 查询 销方
    async searchSell() {
      // let user = this.$store.state.user.user
      // const { data: res } = await queryOrgsAllAndOrgmachine(user)
      // if(!res.success) return this.$message.error('查询销方信息失败！'+res.msg)
      // this.sellData = res.data
    },
    showD() {
      this.drawerShow = true
      this.searchSell()
    },
    // 选择
    chooSell(row) {
      this.sellForm.orgName = row.orgName
      this.sellForm.orgMachine = row.orgMachine
      this.sellForm.orgTaxcode = row.orgTaxcode
      this.sellForm.orgAddress = row.orgAddress
      this.sellForm.orgTelephone = row.orgTelephone
      this.sellForm.orgBankname = row.orgBankname
      this.sellForm.orgBankaccount = row.orgBankaccount
      this.sellForm.payeeName = row.payeeName
      this.sellForm.checkName = row.checkName
      this.sellForm.orgId = row.orgId
      this.drawerShow = false
    },
    hSizeChange(size) {
      this.searchForm.pageSize = size
      this.searchSell()
    },
    hCurrentChange(num) {
      this.searchForm.pageNum = num
      this.searchSell()
    }
  },
}
</script>

<style scoped lang="scss">
.drawerC{
  padding: 0 20px;
}
.butC{
  margin-left: 10px;
  padding:7px 10px;
}
</style>